<template>
  <div class="company">
    <no-ssr>
      <bread :breadList=breadList></bread>
    </no-ssr>
    <div class="company-main">
            <div style="float: left;position: relative;">
              <div class="main-nav">
                  <nav-list :list=selfNavList @tonav="navChenge" ref="nav-list" id='nav-flag'></nav-list>
              </div>
            </div>
            <div class="company-main-body main-body-flag">
                <pro-service :descript="descript" title="企业定制培训" selfImg="/img/insert/college-company.jpg" :serviceitemList=projectService ref="pro-service"></pro-service>
                <direction ref="direction" :directionList=directionData></direction>
                <service-flow :serviceFlow=serviceFlowData ref="service-flow"></service-flow>
                <train-site ref="train-site" :siteList=siteData></train-site>
                <!-- <business-contact title="企业定制培训服务咨询" :businessItemList=contcatData ref="business-contact"></business-contact> -->
            </div>
        </div>
  </div>
</template>

<script>
import bread from '@/components/breadcrumb'
import navList from '@/components/navList'
import proService from '@/components/publicComponent/proService'
import direction from '@/components/college/direction'
import serviceFlow from '@/components/publicComponent/serviceFlow'
import trainSite from '@/components/college/train_site'

import {companyDirection, companySite, serviceContcat, authorities, customEnterprise} from '@/api/getData'
export default {
  name: 'company',
  data () {
      return{
        breadList: [
          {
            text: '国科教育',
            routeName: 'college-intro'
            },
            {
            text: '企业定制',
            routeName: ''
            }
        ],
        selfNavList: [
            {
                text: '企业定制培训',
                ref: 'pro-service'
            },
            {
                text: '课程方向',
                ref: 'direction'
            },
            {
                text: '培训流程',
                ref: 'service-flow'
            },
            {
                text: '培训现场',
                ref: 'train-site'
            }
        ],
        projectService: [],
        directionData: [],
        serviceFlowData: {
            title: '培训流程',
            img: '/img/flow/company_flow.png'
        },
        contcatData: [],
        siteData: [],
        descript: ''
      }
    
  },
  components: {
    bread,
    navList,
    proService,
    direction,
    serviceFlow,
    trainSite
  },
  created(){
    
  },
  async mounted(){
    await companyDirection.call(this).then(res=>{
        this.directionData = res;
    })
    await companySite.call(this).then(res=>{
        this.siteData = res;
    })
    //   serviceContcat.call(this, 3).then(res=>{
    //       this.contcatData = res;
    //   })
    await authorities.call(this, 5).then(res=>{
        this.projectService = res;
    })
    await customEnterprise.call(this,4).then(res=>{
        this.descript = res[0].descr;
    })
    this.$refs['nav-list'].addNavEvent()
  },
  methods: {
      navChenge(key){
        document.body.scrollTop = this.$refs[key].$el.offsetTop +230; 
　　    document.documentElement.scrollTop = this.$refs[key].$el.offsetTop +230;
      }
  }
}
</script>

<style lang="stylus" scoped>
.company{
  width: 1200px;
  padding-top: 20px;
  padding-bottom: 60px;
  margin: 0 auto; 
  border-bottom: 1px solid transparent;
}
.company-main{
    position: relative;
    .company-main-body{
        margin-left: 246px;
    }  
}
</style>
